<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    // async函数也是用来做异步的，语法会更加简单

    // 语法
    // const asyncReadFile = async function () {
    //   const f1 = await readFile('/etc/fstab');
    //   const f2 = await readFile('/etc/shells');
    //   console.log(f1.toString());
    //   console.log(f2.toString());
    // };

    // 如果有异步函数，那么函数前面可以加async关键字
    // 默认还是从上往下执行
    // 一旦碰到await关键字，那么就先停下来
    // 等待await后面的异步出结果
    // 它会自动把后面的结果赋值给前面的变量

    // async 关键字 和 await 关键字必须配套使用
    // await 后面放的异步只能是Promise对象


    function require(url) {
      return new Promise((resolve) => {
        const xhr = new XMLHttpRequest();
        xhr.open('GET', url);
        xhr.send();
        xhr.onload = function() {
          if (xhr.status === 200) {
            // console.log(JSON.parse(xhr.responseText)); // 数据一
            resolve(JSON.parse(xhr.responseText))
          } else {
            console.error('请求失败', xhr.status);
          }
        };
      })
    }

    function delay(ms) {
      return new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve(1234)
          // reject(5678)
        }, ms)
      })
    }



    // function fn () {
    //   require('https://cnodejs.org/api/v1/topics').then(res => {
    //     console.log(res);
    //     return delay(3000);
    //   }).then(() => {
    //     console.log("等待了3秒钟");
    //     return require('https://cnodejs.org/api/v1/topic/61f69e4aa08b39f75309c2a8')
    //   }).then(res => {
    //     console.log(res);
    //   })
    // }
    // fn()

    async function fn() {
      try {
        // 有了await，那么后面的promise的成功的结果res，就不需要写在then的里面了，可以直接赋值给前面的变量了
        const res = await require('https://cnodejs.org/api/v1/topics');
        console.log(res);
        await delay(3000);
        console.log("等待了3秒钟");
        const res2 = await require('https://cnodejs.org/api/v1/topic/61f69e4aa08b39f75309c2a8');
        console.log(res2);
      } catch (error) {
        console.log(error);
      }
    }
    fn()
  </script>
</body>
</html>